<!-- 语言切换器 -->
<% if (locals.siteData.feature?.i18n?.enable) { %>
    <div class="hidden lg:flex items-center">
        <div class="relative">
            <button type="button"
                    onclick="document.getElementById('language-menu').classList.toggle('hidden')"
                    class="flex items-center gap-2 px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 hover:text-gray-900 dark:hover:text-white rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700">
                <!-- 当前语言 -->
                <% const currentLocale = locals.siteData.languages.find(locale => locale.key === locals.pageData.language) %>
                <span><%= currentLocale?.flag %></span>
                <span><%= currentLocale?.name %></span>
                <!-- 下拉箭头 -->
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
                </svg>
            </button>

            <!-- 语言选择下拉菜单 -->
            <div id="language-menu"
                 class="hidden absolute right-0 mt-2 py-2 w-36 space-y-1 bg-white dark:bg-gray-800 rounded-lg shadow-lg ring-1 ring-black ring-opacity-5">
                <% locals.siteData.languages.forEach(locale => {
                    let href = '';
                    // 添加版本路径
                    if (pageData.version) {
                        href += '/' + pageData.version;
                    }
                    // 添加语言路径
                    href += '/' + locale.key;
                    // 添加页面路径
                    href += pageData.noLocalePath.startsWith('/') ? pageData.noLocalePath : '/' + pageData.noLocalePath;
                %>
                <a href="<%= href %>"
                   class="flex items-center gap-2 px-4 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700
                                    <%= locale.key === locals.pageData.language ? 'bg-gray-50 dark:bg-gray-700' : '' %>">
                    <span><%= locale.flag %></span>
                    <span><%= locale.name %></span>
                </a>
                <% }) %>
            </div>
        </div>
    </div>
<% } %>